ホームページの画像
今週は、ホームページ作成の初心者を対象にホームページの基本を紹介します。テーマは「ホームページにおける画像」です。写真やイラスト、アイコンなど、画像をホームページに表示させる機会は多いと思いますが、どんな画像でも利用できるわけではありません。今週は、ホームページで使用する画像の注意点を紹介しましょう。

→ 使える画像は、JPEG、GIF、PNGの3種類
 
ホームページに画像を表示させる場合は、HTMLファイルのほかに画像ファイルを用意します。そして、HTMLファイルの「IMG」タグで画像ファイルを参照し、画面に画像を表示します。このとき、注意しなければいけないのが画像ファイルのファイル形式です。ホームページで利用できる画像の種類は、JPEG、GIF、PNGの3種類です。Internet ExplorerではBMP(ビットマップ)画像も表示できますが、他のブラウザでは必ずしも正しく表示されるとは限りません。また、BMPはファイル容量が大きくなるのもデメリットとなります。このためBMPの利用は避け、JPEG、GIF、PNGの3種類だけを利用するのが基本です。もし、画像形式がこれら3種類以外であった場合は、画像処理ソフトなどでファイル形式を変換する必要があります。


→ 画像サイズは表示されるサイズに変更
 
ホームページに表示される画像のサイズ(大きさ)は、ページのレイアウトに合わせて自動調整されることはありません。画像ファイルそのままのサイズで表示されます。このため、あらかじめ実際に使用する大きさに画像のサイズを調整しておく必要があります。デジタルカメラで撮影した画像は、デスクトップ全体が画像で埋まってしまうほど大きなサイズとなるのが一般的です。よって、デジタルカメラで撮影した画像をホームページで使用する場合は、必ず画像を適切なサイズに変換してから使用する必要があります。なお、この画像サイズの変更も画像処理ソフトで行えます。


→ 画像サイズの強制変更
 
「IMG」タグでは、width属性とheight属性で画像のサイズを強制的に変更することも可能です。この場合、width属性で画像の幅を、height属性で画像の高さをピクセル数(ドット数)で指定します。ただし、この方法による画像表示は、画像ファイルを全て読む必要があるため根本的な解決策となりません。デジタルカメラで撮影した画像のように、大きなサイズの画像を何枚も表示させる場合は、ページ全体が表示されるまでに時間がかかってしまう恐れもあります。前述したように、画像は表示するサイズに変換してから使用するのが基本です。
<HTML>
<HEAD>
  <TITLE>初めてのホームページ作成</TITLE>
</HEAD>

<BODY bgcolor="#FFFFFF">
下の画像は、画像ファイルそのままの大きさで表示した場合です。<BR>
<IMG src="image01.jpg"><BR>
<BR>
<BR>
下の画像は、width属性とheight属性で80×60ピクセルにサイズを強制変更した場合です。<BR>
でも、この方法はあまりお勧めできません…。
<BR>
<IMG src="image01.jpg" width="80" height="60"><BR>
</BODY>

</HTML>


e[NECir Yahoo yV LINEf[^[z500~`I
z[y[W NWbgJ[h COiq@COsI COze